$(function(){
            $.ajax({
                url:'/Admin/Index/getWorks',
                type:'get',
                success:function(data){
                    if(data.code==1){
                        let datas = data.data
                        let htmls = ''
                        for(let key of datas){
                            htmls += `
                                <li>
                                    <p>
                                        <span class="active">${key.year}年度</span>
                                    </p>
                                    <table class="table table-responsive">
                                        <thead>
                                        <tr>
                                            <th>月份</th>
                                            <th>1月</th>
                                            <th>2月</th>
                                            <th>3月</th>
                                            <th>4月</th>
                                            <th>5月</th>
                                            <th>6月</th>
                                            <th>7月</th>
                                            <th>8月</th>
                                            <th>9月</th>
                                            <th>10月</th>
                                            <th>11月</th>
                                            <th>12月</th>
                                            <th>操作</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                        <tr class='work_days'>
                                            <td>工作日(天)</td>
                                        `

                                        for(let day in key.work_days){
                                            htmls+=`
                                                <td><input type="text" value="${key.work_days[day]}" readonly maxlength="2" data-mon='${Number(day)+1}'></td>
                                            `
                                        }
                                            
                                htmls+=`
                                            <td rowspan="2"><a href="#" class='edit'>编辑</a></td>
                                        </tr>
                                        <tr class='work_hours'>
                                            <td>标准工时(h)</td>
                                        `
                                            for(let hours in key.work_hours){
                                                htmls+=`
                                                    <td><input type="text" value="${key.work_hours[hours]}" readonly maxlength="2" data-mon='${Number(hours)+1}'></td>
                                                `
                                            }

                               htmls+=`
                                        </tr>
                                        </tbody>
                                    </table>
                                </li>

                            `
                        }
                        $('#list').html(htmls)
                    }
                }
            })

            $('#btn').click(function(){
                let html = `
                <li>
                <p class="active">
                    <span>请选择年份</span>
                    <select class="active">
                        <option value="">请选择年份</option>
                    `
                    let nowYears = new Date().getFullYear()
                    // console.log( typeof nowYears)
                for (let i = 2019;i<=nowYears+10;i++){
                    html+=`
                       <option value="${i}">${i}年度</option>
                     `
                }
                html+=`
                </select>
                </p>
                <table class="table table-responsive">
                    <thead>
                        <tr>
                            <th>月份</th>
                            <th>1月</th>
                            <th>2月</th>
                            <th>3月</th>
                            <th>4月</th>
                            <th>5月</th>
                            <th>6月</th>
                            <th>7月</th>
                            <th>8月</th>
                            <th>9月</th>
                            <th>10月</th>
                            <th>11月</th>
                            <th>12月</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr class='work_days'>
                            <td>工作日(天)</td>
                            <td><input type="text" value=""  maxlength="2" data-mon='1'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='2'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='3'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='4'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='5'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='6'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='7'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='8'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='9'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='10'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='11'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='12'></td>
                            <td rowspan="2"><a href="#" class="edit">保存</a></td>
                        </tr>
                        <tr class='work_hours'>
                            <td>标准工时(h)</td>
                            <td><input type="text" value=""  maxlength="2" data-mon='1'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='2'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='3'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='4'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='5'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='6'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='7'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='8'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='9'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='10'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='11'></td>
                            <td><input type="text" value=""  maxlength="2" data-mon='12'></td>
                        </tr>
                    </tbody>
                </table>
            </li>
            `
                $('#list').prepend(html)
            })

            $('section').on('click','.edit',function (e) {
                if($(this).html()==='编辑'){
                    
                    $(this).closest('table').find('input').removeAttr('readonly');
                    $(this).html('保存')

                }else{
                    let year = parseInt($(this).closest('li').children('p').children('span').html())
                    let years = $(this).closest('li').children('p').children('select').val()
                    if(!year && !years){
                        $('#yz_modal').html('请选择年份')
                        tipShow()
                        return
                    }

                    let work_days = $(this).closest('li').children('table').find('tr.work_days input')
                    let days = []
                    for(let d=0; d<work_days.length; d++){
                        let val = work_days[d].value
                        if(!val){
                            $(work_days[d]).css({'border-color':'#ff0000'})
                            $(work_days[d]).focus()
                            return
                        }else{
                            if($(work_days[d]).attr('data-mon') == 2){
                                let maxDay = 0
                                if(year){
                                    if( (year % 4 == 0 && year % 100 != 0 ) || year % 400 == 0 ){
                                        maxDay = 29
                                    }else{
                                        maxDay = 28
                                    }
                                }else if(years){
                                    if( (years % 4 == 0 && years % 100 != 0 ) || years % 400 == 0 ){
                                        maxDay = 29
                                    }else{
                                        maxDay = 28
                                    }
                                }else{
                                    maxDay=29
                                }
                                if(val > maxDay){
                                    work_days[d].value = maxDay
                                }
                            }
                            days.push(val)
                        }
                    }


                    let work_hours = $(this).closest('li').children('table').find('tr.work_hours input')
                    let hours = []
                    for(let h=0; h<work_hours.length; h++){
                        let val = work_hours[h].value
                        if(!val){
                            $(work_hours[h]).css({'border-color':'#ff0000'})
                            $(work_hours[h]).focus()
                            return
                        }else{
                            hours.push(val)
                        }
                    }
                    let works = {
                        year:year||years,
                        work_days:days,
                        work_hours:hours
                    }
                    let that = this
                    console.log(works)

                    $.ajax({
                        url:'/Admin/Index/setWorks',
                        type:'post',
                        data:{
                            works:works
                        },
                        success:function(data){
                            if(data.code==1){
                                $(that).closest('table').find('input').attr('readonly','readonly');
                                $(that).closest('li').children('p').children('span').html(year||years+'年度')
                                $(that).html('编辑')
                                $(that).closest('li').children('p').removeClass('active')
                                $(that).closest('li').children('p').children('select').removeClass('active')
                                $(that).closest('li').children('p').children('span').addClass('active')
                            }else{
                                $('#yz_modal').html('请选择年份')
                                tipShow()
                                return
                            }
                        }
                    })


                    
                }
            })


// 弹出来的小框框
    function tipShow(){
        $('#yz_modal').addClass('active')
        window.tipBox = setTimeout(function(){
            $('#yz_modal').removeClass('active')
            clearTimeout(tipBox)
        },2000)
    }



    $('#list').on('input', 'input', function() {
        // console.log($(this).val());
        // console.log($(this).data('mon'));
        // console.log($(this).closest('tr').hasClass('work_days'))
        // console.log($(this).closest('tr').hasClass('work_hours'))

        if($(this).closest('tr').hasClass('work_hours')){
            let val =  Number($(this).val())
            let maxHours = 24
            
            if(val>maxHours){
                $(this).val('24')
            }
        }else if ($(this).closest('tr').hasClass('work_days')){
            let year = parseInt($(this).closest('li').children('p').children('span').html())
            let years = $(this).closest('li').children('p').children('select').val()
            console.log(year,years)
            let val =  Number($(this).val())
            let mon = $(this).data('mon')
            let maxDay = 0
            if(mon==2){
                if(year){
                    if( (year % 4 == 0 && year % 100 != 0 ) || year % 400 == 0 ){
                        maxDay = 29
                    }else{
                        maxDay = 28
                    }
                }else if(years){
                    if( (years % 4 == 0 && years % 100 != 0 ) || years % 400 == 0 ){
                        maxDay = 29
                    }else{
                        maxDay = 28
                    }
                }else{
                    maxDay=29
                }
            }else if(mon==1||mon==3||mon==5||mon==7||mon==8||mon==10||mon==12){
                maxDay = 31
            }else if(mon==4||mon==6||mon==9||mon==11){
                maxDay = 30
            }
            if(val>maxDay){
                $(this).val(maxDay)
            }
        }
    });
            
        })